<template>
    <div class="root">
        <h1>{{ name }}</h1>
        <br>
        <h1>{{ address }}</h1>
        <br>
        <h2 v-if = studentName>{{ studentName }}</h2>
        <button @click=sendNameToStudent> 把学校名发给学生 </button>
        <button @click=sendIDtoStudent> 发送nanoID给学生 </button>
        <button @click=destroyMe>destroyMe,我注销了所有事件</button>

        <button @click=logStudentName>logStudentName</button>

    </div>
</template>

<script>

import { nanoid } from "nanoid";
import PubSub from 'pubsub-js';
export default {
    name: 'MySchool',
    data() {
        return {
            name: '深圳大学',
            address: "深南大道3599号",
            studentName:''
        }
    },
    methods:{
        sendNameToStudent(){
            console.log(this)

        },
        destroyMe(){
            PubSub.unsubscribe()
        },
        sendIDtoStudent(){
            PubSub.publish('getNanoidBySchool',nanoid())
        },
        logStudentName(){
            console.log(this.studentName == false)
            console.log(this.studentName)
        }
    },
    mounted() {
       this.studentNameID = PubSub.subscribe('getStudentName',(_,name)=>{
        console.log('-----getStudentName')
            this.studentName = name
       })
    },
    beforeDestroy(){
        PubSub.unsubscribe(this.studentNameID)
    }

}
</script>
 

<style lang="less" scoped>
    .root {
        background-color: plum;
    }
</style>